﻿<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" href="/css/default.css" />
    <script src="../Scripts/jquery-2.1.0.js"></script>
    <script src="../Scripts/jquery-2.1.0.min.js"></script>
    <script src="../js/fb.js"></script>
    <script src="../js/videoShare.js"></script>
</head>
<body>
    <div data-win-control="SdkSample.ScenarioInput">
        <h3 id="PointsThroughShare">Earn Points through share scenario</h3><br />
        <p>
            This scenario shows how to earn points by playing and sharing the video on facebook.
        </p>
        <p>
            <button id="playVideo" class="action" title="Play video to earn points">
                Play Video
            </button>
            Play the video and get 10 points
        </p>
        <p> <button class="action" id="stop">Stop Video</button> Click to stop this video</p>
        <p>
            <button id="share2PurchaseButton" class="bt-fs-dialog" title="Login to your account and share  Video to earn points">
                Share Video
            </button>
            Login to your facebook account and share video to get 50 points.
        </p>
        <!--<a href="javascript:{}" class="bt-fs-dialog">Click here</a>-->


    </div>
    <div data-win-control="SdkSample.ScenarioOutput">
        
     
            <video id="subtitleVideo" style="position: relative; z-index: auto; width: 50%;"
                   src="http://ie.microsoft.com/testdrive/Videos/BehindIE9AllAroundFast/Video.mp4"
                   loop >
                <!--<track id="scenario3entrack" src="media/sample-subtitle-en.vtt" kind="subtitles"
                       srclang="en" default>-->
            </video>
        
        <p id="results"></p>
        <p>
            Points:
        </p>
        <div id="points">
            <!-- The displayed text is provided by js file -->0
        </div>
    </div>


</body>
</html>